<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
    <title>在线查单</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <!-- load css -->
    <link rel="stylesheet" th:href="@{/css/font.css}" />
	<link rel="stylesheet" th:href="@{/css/xadmin.css}" />
    <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/layui/layui.js}" charset="utf-8"></script>
    <script type="text/javascript" th:src="@{/js/xadmin.js}"></script>
</head>
<body class="layui-anim layui-anim-fadein">
  
    <div class="x-body">
      <table class="layui-hide" id="table1" lay-filter="tool1"></table>
      </div>
<script type="text/html" id="statusTpl">
{{#  if(d.status == 1){ }}
<span style="color: green;">充值成功</span>
{{#  }else if(d.status == -1){ }}
<span style="color: blue;">待付款</span>
{{#  }else if(d.status == -2){  }}
<span style="color: red;">已退款</span>
{{#  }else{  }}
<span>未支付</span>
{{#  }  }}
</script>
<script>
      layui.use(['laydate', 'laypage', 'table', "upload"], function(){
        var laydate = layui.laydate,
        table = layui.table, //表格
        laypage = layui.laypage, //分页
        upload = layui.upload;//主要是这个
        //执行一个 table 实例
        table.render({
          elem: '#table1'
          ,height: 500
          ,limit: 100
          ,limits:[100]
          ,url: '[[@{/admin/account/onlineOrderList.html?id=}]]'+ '[[${id}]]'//数据接口
          ,id:'table1'
          ,page: true
          ,cols: [
           [
            {field: 'orderNo', title: '官方订单号', width:'20%', sort: true, align:'center',fixed: 'left'}
            ,{field: 'account', title: '充值户号', width: '15%', align:'center'}
            ,{field: 'amount', title: '订单金额', width: '15%', align:'center'}
            ,{field: 'channel', title: '缴费机构', width: '15%', align:'center'}
            ,{field: 'createTime', title: '发起时间', width: '20%', align:'center'}
            ,{field: 'status', title: '支付状态', width: '15%', align:'center',templet:'#statusTpl'}
          ]
          ]
        });
      });
    </script>
  </body>
</html>
